<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>资料录入</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" href="/static/wx/lib/sui/sm.min.css">
    <link rel="stylesheet" href="/static/wx/lib/sui/sm-extend.min.css">
    <link rel="stylesheet" href="/static/wx/css/reset.css">
    <link rel="stylesheet" href="/static/wx/css/main.css">
    <link rel="stylesheet" href="/static/wx/css/public_main.css">
</head>

<body>
    <div class="page-group">
        <div class="page page-current" id="">
            <!-- 主内容 -->
            <div class="content bg-white">
                <div class="bs-box">
                    <div class="bs-box-content margin-t">
                        <div class="bs-box-inner">
                            <div class="bs-box-content-item width-link size-m">
                                <div>货品在</div>
                                <div>
                                    <input placeholder="请选择受损时间" id="present_at" value="{if isset($info.present_at)}{$info.present_at|substr=0,10}{/if}"/>
                                </div>
                                <div>时的现状情况</div>
                            </div>
                            <div class="bs-box-content-item">
                                <p class="size-m">货品清单(限doc,xlsx,pdf)</p>
                                <div class="uploader">
                                    <ul class="uploader-files" id="uploader-files">
                                        {if !empty($info.goods_list)}
                                        {volist name="info.goods_list" id="vo"}
                                        <li class="uploader-file" style="background-image:url('/static/wx/imgs/img/text.jpg')">
                                            <span class="close" onclick="deleteT(this)">x</span>
                                            <a href="{$vo.url}" download>{$vo.name}</a>
                                        </li>
                                        {/volist}
                                        {/if}
                                    </ul>
                                    <div class="uploader-content">
                                        <div class="uploader-input-box">
                                            <input class="uploader-input" type="file" accept="image/*" />
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="bs-box-content-item">
                                <p class="size-m">货品现状描述</p>
                                <div>
                                     <textarea class="size-m no-outline" placeholder="请输入受损原因" rows="3"
                                               style="width:100%;padding-right:.5rem;" id="goods_desc">{if isset($info.goods_desc)}{$info.goods_desc }{/if}</textarea>
                                </div>
                            </div>
                            <div class="bs-box-content-item border-b-none">
                                <p class="size-m">上传视频</p>
                                <div class="uploader">
                                    <ul class="uploader-files" id="uploader-vedivo">
                                        <!--<li class="uploader-file">-->
                                        <!--&lt;!&ndash;<video style="height:auto;" src="http://rongyp.oss-cn-shanghai.aliyuncs.com/1111.mp4" id="video0" controls="controls"></video>&ndash;&gt;-->
                                        <!--</li>-->
                                        {if !empty($info.present_video)}
                                        {volist name="info.present_video" id="vol"}
                                        <li class="uploader-file" style="background-image:url({$vol})">
                                            <span class="close" onclick="deleteT(this)">x</span>
                                        </li>
                                        {/volist}
                                        {/if}
                                    </ul>
                                    <div class="uploader-content">
                                        <div class="uploader-input-box">
                                            <input class="uploader-input" type="file" accept="image/*" />
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="bs-box-content-item border-b-none">
                                <p class="size-m">上传照片</p>
                                <div class="uploader">
                                    <ul class="uploader-files" id="uploader-imges">
                                        {if !empty($info.present_img)}
                                        {volist name="info.present_img" id="vo"}
                                        <li class="uploader-file" style="background-image:url({$vo})">
                                            <span class="close" onclick="deleteT(this)">x</span>
                                        </li>
                                        {/volist}
                                        {/if}
                                    </ul>
                                    <div class="uploader-content">
                                        <div class="uploader-input-box">
                                            <input class="uploader-input" type="file" accept="image/*" onchange="handleInputChange1(event)"/>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
                <input type="hidden" value="{$policy_num}" name='policy_num'>
                <input type="hidden" value="{$p_id}" name='p_id'>
                <div class="btn-box">
                    <div class="my-btn" id="submit">
                        <span class="active">保存</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
    </div>
    </div>
    <script type='text/javascript' src='/static/wx/lib/sui/zepto.min.js' charset='utf-8'></script>
    <script type='text/javascript' src='/static/wx/lib/sui/sm.min.js' charset='utf-8'></script>
    <script type='text/javascript' src='/static/wx/lib/sui/sm-extend.min.js' charset='utf-8'></script>
</body>
<script>
    $(function () {
        // var myDate = new Date();
        // var year = myDate.getFullYear();//获取年
        // var month = myDate.getMonth() + 1;////获取月
        // var day = myDate.getDate();//获取日
        // if (month < 10) month = "0" + month;
        // if (day < 10) day = "0" + day;
        // var time = year + "-" + month + "-" + day;
         var n = $('.step-box').children().length;
        $('.step-item').css('width', document.body.clientWidth / n + 'px');

        var present_at = $("#present_at").val();
        $("#present_at").calendar({
            value: [present_at]
        });

        $(document).on('click', '#submit', function () {
            var poliecy = $("input[ name='policy_num']").val();
            var p_id = $("input[ name='p_id']").val();
            var present_at = $("#present_at").val()
            var goods_desc = $("#goods_desc").val();

            var arr=[];
            var list=[];
            $("#uploader-imges  li").each(function(index){
                var i=0;
                var url=$(this).css('background-image');
                url= url.split('("')[1].split('")')[0];
                arr.push(url);
            })

            $("#uploader-files  li a").each(function(index){
                var url=$(this).attr('href');
                list.push(url);
            })
            $.ajax({
                type: 'POST',
                url: "{:url('recordor/update')}",
                data: {
                    'policy_num': poliecy,
                    'present_at': present_at,
                    'goods_list': JSON.stringify( list ),//货品清单
                    'goods_desc': goods_desc,
                    'present_img': JSON.stringify( arr ),//货品现状
                    'present_video': 'www.92wukai.com',//货品现状
                },
                dataType: 'json',
                success: function (Json) {
                    if (Json.code == 200) {
                        $.alert('保存成功');
                        location.href="{:url('recordor/insurerInfo')}?p_id="+p_id;
                    } else {
                        $.alert('保存失败');
                    }
                }
            });
        });

    });
    //获取对象
    function handleInputChange1(event) {
        console.log(event);
        var formData= handleInputChange(event);
        uploadImg(formData);

    }
    function handleInputChange2(event){
        //   const file = event.target.files[0];
        var formData= handleInputChangebyVideo(event);
        $.ajax({
            type: 'POST',
            url: "{:url('upload/index')}",
            data: formData,
            processData: false,
            contentType: false,
            cache: false,
            success: function (Json) {
                console.log(Json.data)
                if (Json.code == 200) {
                    // a="<li class=\"uploader-file\" style=\"background-image:url('"+Json.data.url+"')\">";
                    // a+= "<span class=\"close\" onclick='deleteT(this) '>x</span>"
                    // a+= "</li>"
                    // $('#uploader-imges').append(a);
                } else {
                    $.alert('上传失败');
                }
            }
        });
    }
    function handleInputChange3(event){
        const file = event.target.files[0];
        var formData= handleInputChangebyFile(event);
        $.ajax({
            type: 'POST',
            url: "{:url('upload/index')}",
            data: formData,
            processData: false,
            contentType: false,
            cache: false,
            success: function (Json) {
                if (Json.code == 200) {
                    var url=decodeURI(Json.data.url)
                    var obj=url.lastIndexOf("/");
                    var name =url.substr(obj+1);
                    a="<li class=\"uploader-file\" style=\"background-image:url('/static/wx/imgs/img/text.jpg')\">";
                    a+= "<span class=\"close\">x</span>"
                    a+="<a href='"+url+ "' download>"+ name+"</a>"
                    a+= "</li>"
                    $('#uploader-files').append(a);
                } else {
                    $.alert('上传失败');
                }
            }
        });
    }
    // 上传图片
    function  uploadImg (formData) {
        $.ajax({
            type: 'POST',
            url: "{:url('upload/index')}",
            data: formData,
            processData: false,
            contentType: false,
            cache: false,
            success: function (Json) {
                // console.log(Json.data)
                if (Json.code == 200) {
                    url=decodeURI(Json.data.url)
                    a="<li class=\"uploader-file\" style=\"background-image:url('"+url+"')\">";
                    a+= "<span class=\"close\" onclick='deleteT(this) '>x</span>"
                    a+= "</li>"
                    $('#uploader-imges').append(a);
                } else {
                    $.alert('上传失败');
                }
            }
        });
    }
    function deleteT(obj) {
        $(obj).parent('li').remove();
    }
    </script>
</html>